.tree_menu {
  width:100%;
}
.tree_main {
  background-color: transparent;
  margin-bottom:0;
  margin-top:-3px;
}

.tree_main_item {
  height:45px;
  border-top: 1px solid #333333;
  border-bottom: 1px solid #333333;
  font-size: 18px;
  line-height:28px;
  color: darkgray;
  cursor: pointer;
  &:hover {
    background-color: #333333;
    color: #ffffff;
  }
}

.tree_active {
  background-color: #333333;
  color: #ffffff;
}

.tree_panel {
  background-color: #3c3c3c;
}

.tree_list {
  margin:0;
  list-style-type: disc;
  li {
    position: relative;
    display: block;
    padding: 10px 0;
  }

  a {
    color:#999999;
  }

  a:hover {
    color:#ffffff;
  }

  a:focus {
    color:#ffffff;
  }
}

.tree_item_active {
  color:#ffffff;
}

.tree_icon_trm {
  transform:rotate(0deg);
  transition:transform 300ms;
}

.tree_icon_down {
  transform:rotate(-90deg);
}

@keyframes rotate {
  from {
    transform:rotate(0deg);
  }
  to {
    transform:rotate(90deg);
  }
}

.go_90 {
  animation:rotate 100ms linear;
}